@import "./color.scss";
/* 自定义样式 */
.p-absolute {
  position: absolute;
}
.p-absolute-center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* 字体 */
.f-24 {
  font-size: 48rpx;
}
.f-18 {
  font-size: 36rpx;
}
.f-17 {
  font-size: 34rpx;
}
.f-16 {
  font-size: 32rpx;
}
.f-14 {
  font-size: 28rpx;
}
.f-12 {
  font-size: 24rpx;
}
.f-bold {
  font-weight: bold;
}
/* 字体颜色 */
.t-red {
  color: $self-color-red;
}
.t-white {
  color: #ffffff;
}
.t-green {
  color: $self-color-green;
}
.t-light-green {
  color: $self-color-light-green;
}
.t-deep-green {
  color: $self-color-deep-green;
}
.t-blue {
  color: $self-color-blue;
}
.t-title {
  color: $self-color-title;
}
.t-orange {
  color: $self-color-orange;
}
.t-error {
  color: $self-color-error;
}
.t-section {
  color: $self-color-section;
}
.mining-green {
  color: $self-color-mining-green;
}
.mining-blue {
  color: $self-color-mining-blue;
}
/* 行内元素块级元素 */
.d-i-b {
  display: inline-block;
}

/* 内外边距 */
.m-t-10 {
  margin-top: 20rpx;
}
.m-b-10 {
  margin-bottom: 20rpx;
}
.m-l-10 {
  margin-left: 20rpx;
}
.m-r-10 {
  margin-right: 20rpx;
}
.m-l-20 {
  margin-left: 40rpx;
}
.m-t-20 {
  margin-top: 40rpx;
}
.p-l-10 {
  padding-left: 20rpx;
}
.p-r-10 {
  padding-right: 20rpx;
}
.p-t-10 {
  padding-top: 20rpx;
}
.p-b-10 {
  padding-bottom: 20rpx;
}
.p-10 {
  padding: 20rpx;
}

.red {
  border: 1rpx solid red;
}
/* 高度宽度 */
.w-50p {
  width: 50%;
}
.w-100p {
  width: 100%;
}
.h-50p {
  height: 50%;
}
.h-100p {
  height: 100%;
}

/* 弹性布局 */
.flex {
  display: flex !important;
  &.column {
    flex-direction: column;
    align-items: stretch;
  }
  > .item {
    position: relative;
    /*background:#fff;*/
    &.one {
      flex: 1;
      overflow: hidden;
    }
    &.two {
      flex: 2;
    }
    &.three {
      flex: 3;
    }
    &.four {
      flex: 4;
    }
    &.five {
      flex: 5;
    }
    &.six {
      flex: 6;
    }
    &.seven {
      flex: 7;
    }
    &.eight {
      flex: 8;
    }
    &.nine {
      flex: 9;
    }
    > .content {
      position: absolute;
      width: 100%;
      height: 100%;
      overflow: hidden;
      left: 0;
      top: 0;
    }
    &.overflow-y {
      height: 100%;
      overflow-y: scroll;
    }
    &.overflow-x {
      width: 100%;
      overflow-x: scroll;
    }
  }
  //折行
  &.flex-nowrap {
    flex-wrap: nowrap;
  }
  &.flex-wrap {
    flex-wrap: wrap;
  }
  &.flex-wrap-reverse {
    flex-wrap: wrap-reverse;
  }
  //横向对齐方式
  &.row-left {
    justify-content: flex-start;
  }
  &.row-right {
    justify-content: flex-end;
  }
  &.row-center {
    justify-content: center;
  }
  &.row-between {
    justify-content: space-between;
  }
  &.row-around {
    justify-content: space-around;
  }
  //纵向对齐方式
  &.col-top {
    align-items: flex-start;
  }
  &.col-bottom {
    align-items: flex-end;
  }
  &.col-center {
    align-items: center;
  }
  &.col-baseline {
    align-items: baseline;
  }
  &.col-stretch {
    align-items: stretch;
  }
  //多行纵向对齐方式
  &.multi-line-col-top {
    align-content: flex-start;
  }
  &.multi-line-col-bottom {
    align-content: flex-end;
  }
  &.multi-line-col-center {
    align-content: center;
  }
  &.multi-line-col-between {
    align-content: space-between;
  }
  &.multi-line-col-around {
    align-content: space-around;
  }
  &.multi-line-col-stretch {
    align-content: stretch;
  }
}

/* 字体对其方式 */
.t-c {
  text-align: center;
}

.content-wrap {
  height: 100%;
  width: 100vw;
  display: flex;
  flex-direction: column;
}

/* 覆盖 */
$themeColor: #5bac84;

.popup-x-footer text:hover {
  color: $themeColor !important;
  cursor: pointer;
  opacity: 0.8;
}

.popup-x-footer .confirm {
  margin-left: 20px;
  color: $themeColor !important;
}

.uni-datetime-picker--btn {
  background-color: $themeColor !important;
}

.uni-calendar-item__weeks-box .uni-calendar-item--checked {
  background-color: $themeColor !important;
}
.uni-datetime-picker-btn-text {
  color: $themeColor !important;
}

.uni-date-x {
  background: #f1f5f3 !important;
  color: #999999 !important;
  border-radius: 20rpx !important;
}

.uni-picker-action-confirm {
  color: $themeColor !important;
}
.mine-input {
  border-radius: 10rpx;
  background-color: #e5eae8;
  padding-right: 10px !important;
  margin-left: 20rpx;
}
.main {
  height: 100%;
  overflow: auto;
  display: flex;
  flex-direction: column;
}
.uni-date-x {
  height: 44px;
  background: #fff !important;
  color: #999999 !important;
  border-radius: 44px !important;
}
